import React, { useReducer } from 'react'
// 准备ruducer的依赖
import userReducer, { initialState } from '../store/User/index'
import { actionCreator } from '../store/action'

export default function UseReducer() {
    // useReducer可以看作是useState的升级版
    // 两个参数，第一个是reducer 第二个是初始化的数据
    // 返回值还是两个 第一个是变量；第二个是修改变量的函数
    // 订阅数据以及取消订阅 都不用写了
    const [state, dispatch] = useReducer(userReducer, initialState)
    let changeName = () => {
        dispatch(actionCreator.changeName('ABJS'))
    }
    return (
        <div>
            <p>在函数组件中使用reducer</p>
            <p>{state.age} -- {state.name}</p>
            <button onClick={() => changeName()}>改名为：ABJS</button>
        </div>
    )
}
